<template>
	<wd-popup safe-area-inset-bottom custom-class="wd-popup-order" v-model="showOrder" position="bottom"
		@close="showOrder = false">
		<view class="body">
			<view class="title">发送订单</view>
			<wd-form ref="form">
				<wd-cell-group border>
					<wd-picker @confirm="pickerConfirm" ref="wdPicker" prop="category_id" :column-change="columnChange"
						v-model="orderInfo.category_id" label-width="100px" :columns="caseTypeList" value-key="id"
						label-key="title" label="案件类型" placeholder="请选择案件类型">
						<template v-slot:default></template>
					</wd-picker>
					<wd-input v-model="orderInfo.price" label="费用" label-width="100px" prop="price" clearable
						placeholder="请输入费用" />
					<wd-cell vertical title-width="100px" title="备注信息">
						<wd-textarea v-model="orderInfo.f_desc" prop="f_desc" on-border auto-height placeholder="备注信息"
							clearable />
					</wd-cell>
				</wd-cell-group>
				<view class="footer">
					<wd-button custom-class="wd-button-custom-class-my-success wd-button-custom-class-w100"
						type="primary" size="large" @click="handleSubmit" block>
						提交
					</wd-button>
				</view>
			</wd-form>
		</view>
	</wd-popup>

	<wd-popup safe-area-inset-bottom custom-class="wd-popup-order" v-model="showTailOrder" position="bottom"
		@close="showTailOrder = false">
		<view class="body">
			<view class="title">发起尾款</view>
			<wd-form ref="form">
				<wd-cell-group border>
					<wd-picker @confirm="pickerCaseConfirm" ref="wdPicker" prop="anjian_order_id"
						v-model="tailOrder.anjian_order_id" label-width="100px" :columns="caseList" value-key="id"
						label-key="anjian_name" label="案件" placeholder="请选择案件">
						<template v-slot:default></template>
					</wd-picker>
					<wd-input v-model="tailOrder.price" label="费用" label-width="100px" prop="price" clearable
						placeholder="请输入费用" />
					<wd-cell vertical title-width="100px" title="备注信息">
						<wd-textarea v-model="tailOrder.remark" prop="remark" on-border auto-height placeholder="备注信息"
							clearable />
					</wd-cell>
				</wd-cell-group>
				<view class="footer">
					<wd-button custom-class="wd-button-custom-class-my-success wd-button-custom-class-w100"
						type="primary" size="large" @click="handleTailSubmit" block>
						提交
					</wd-button>
				</view>
			</wd-form>
		</view>
	</wd-popup>
</template>

<script lang="ts" setup>
	import { ref, onMounted, defineExpose } from 'vue';
	import { getCategoryFirstList, getCategoryTwoList, getProfileByuuid } from '@/api/index';
	import api from '@/api/index';
	import { useImStore } from '../../store';
	const props = defineProps({
		// 是否显示语音输入按钮
		useruuid: { type: String, },
		caseList: { type: Array, },
	});
	const emits = defineEmits(['setUploadShow']);
	const imStore = useImStore();
	const showOrder = ref<boolean>(false);
	const showTailOrder = ref<boolean>(false);
	const caseTypeList = ref([]);
	const orderInfo = ref<any>({
		firstCategory: null,
		twoCategory: null,
		category_id: null,
		price: '', // 费用
		f_desc: '' // 备注信息，可不填，用于备注订单信息，如：订单包含xxx商品，不含xxx商品等。
	});
	const tailOrder = ref<any>({
		anjian_order_id: null,
		price: '', // 费用
		remark: '' // 备注信息，可不填，用于备注订单信息，如：订单包含xxx商品，不含xxx商品等。
	});
	const pickerCaseConfirm = (e) => {
		console.log(e, 'e');
	};
	const pickerConfirm = (e : any) => {
		console.log(e, 'e');
		if (e.length > 1) {
			orderInfo.value.category_id = e;
		} else {
			// orderInfo.value.category_id = orderInfo.value.twoCategory;
			orderInfo.value.category_id = [orderInfo.value.firstCategory, orderInfo.value.twoCategory];
		}
	};
	const columnChange = (e) => {
		const valuse = e.getValues();
		if (valuse[0] !== orderInfo.value.firstCategory) {
			initCategory(
				[
					{
						id: valuse[0]
					}
				],
				(list) => {
					if (list.length > 0) {
						e.setColumnData(1, list, 0);
						// orderInfo.value.twoCategory = list.id;
						// orderInfo.value.category_id = list.id;
					} else {
						e.setColumnData(1, [e.getSelects()[0]], 0);
						orderInfo.value.twoCategory = e.getSelects()[0].id;
						// orderInfo.value.category_id = list.id;
					}
				}
			);
		}
		orderInfo.value.firstCategory = valuse[0]; // 获取一级分类的值，并将其赋值给orderInfo.firstCategory。
		orderInfo.value.twoCategory = valuse[1]; // 获取二级分类的值，并将其赋值给orderInfo.twoCategory。

	};

	const initCategory = (res : any, func ?: Function) => {
		getCategoryTwoList({
			id: res[0].id
		}).then((res) => {
			if (func) {
				func(res);
			} else {
				orderInfo.value.twoCategory = res[0].id;
				orderInfo.value.category_id = [orderInfo.value.firstCategory, orderInfo.value.twoCategory];
				caseTypeList.value[1] = res;
			}
		});
	};
	const openCreateFinal = () => {
		showTailOrder.value = !showTailOrder.value;
	};
	const openCreateOrder = () => {
		showOrder.value = !showOrder.value;
		// 获取案件分类
	};
	const handleTailSubmit = async () => {
		if (uni.$appConfig.platform === 'user') {
			imStore.sendMessage(
				{
					data: 'order',
					description: '',
					extension: JSON.stringify({
						...tailOrder.value,
						type: '尾款',
						orderId: tailOrder.value.anjian_order_id
					})
				},
				'custom',
				props.useruuid
			);
			openCreateFinal();
			emits('setUploadShow');
		} else {
			api.pubWeikuanOrder({
				...tailOrder.value
			}).then((res : any) => {
				imStore.sendMessage(
					{
						data: 'order',
						description: '',
						extension: JSON.stringify({
							...tailOrder.value,
							type: '尾款',
							orderId: tailOrder.value.anjian_order_id,
							weikuan_order_id: res.weikuan_order_id
						})
					},
					'custom',
					props.useruuid
				);
				tailOrder.value = {
					anjian_order_id: null,
					price: '', // 费用
					remark: '' // 备注信息，可不填，用于备注订单信息，如：订单包含xxx商品，不含xxx商品等。
				};
				openCreateFinal();
				emits('setUploadShow');
			});
		}


	};
	const handleSubmit = async () => {
		const userInfo = await getProfileByuuid({
			uuid: props.useruuid
		});
		if (uni.$appConfig.platform === 'user') {
			imStore.sendMessage(
				{
					data: 'order',
					description: '',
					extension: JSON.stringify({
						...orderInfo.value
					})
				},
				'custom',
				props.useruuid
			);
			openCreateOrder();
			emits('setUploadShow');
		} else {
			api.imPubOrder({
				user_id: userInfo.uid,
				...orderInfo.value,
				category_id: orderInfo.value.category_id[1]
			}).then((res : any) => {
				imStore.sendMessage(
					{
						data: 'order',
						description: '',
						extension: JSON.stringify({
							...orderInfo.value,
							orderId: res.order_id
						})
					},
					'custom',
					props.useruuid
				);
				orderInfo.value = {
					firstCategory: null,
					twoCategory: null,
					category_id: null,
					price: '', // 费用
					f_desc: '' // 备注信息，可不填，用于备注订单信息，如：订单包含xxx商品，不含xxx商品等。
				};
				openCreateOrder();
				emits('setUploadShow');
			});
		}

	};
	onMounted(() => {
		getCategoryFirstList().then((res : any) => {
			caseTypeList.value[0] = res;
			orderInfo.value.firstCategory = res[0].id;
			initCategory(res);
		});
	})
	defineExpose({
		openCreateFinal,
		openCreateOrder
	})
</script>